<template>
  <el-dialog title='岗位信息修改' :visible.sync='isShow' width='650px' :lock-scroll="false" :close-on-click-modal="false" @close='reset()' @open="init()">
    <div v-loading="loading">
      <el-card class='type-info-box-card'>
        <el-form ref='queryForm' size='mini' :model="queryForm" label-width="140px" :rules="rules" label-position="center">
          <el-row :gutter="30">
            <el-col :span='100'>
              <el-form-item label='岗位编号' prop='POSTID'>
                <el-input v-model='queryForm.POSTID' placeholder="请输入岗位编号" filterable style="width:350px" :disabled="true"></el-input>
              </el-form-item>
              <el-form-item label='岗位名称' prop='POSTNAME'>
                <el-input v-model='queryForm.POSTNAME' placeholder="请输入岗位名称" filterable style="width:350px"></el-input>
              </el-form-item>
              <el-form-item label='备注1' prop='REMARK1'>
                <el-input v-model='queryForm.REMARK1' placeholder="请输入备注1"  style="width:350px"></el-input>
              </el-form-item>
              <el-form-item label='备注2' prop='REMARK2'>
                <el-input v-model='queryForm.REMARK2' placeholder="请输入备注2"  style="width:350px"></el-input>
              </el-form-item>
              <el-form-item label='备注3' prop='REMARK3'>
                <el-input v-model='queryForm.REMARK3'  placeholder="请输入备注3"  style="width:350px"></el-input>
              </el-form-item>
            </el-col>
          </el-row>

        </el-form>
      </el-card>
      <div slot="footer" style="margin:10px 0;text-align:center">
        <el-button size="mini" @click="isShow=false">取消</el-button>
        <el-button type='primary' size='mini' @click="submit">确定</el-button>
      </div>
    </div>
  </el-dialog>
</template>

<script>
  import request from "@/common/utils/requestCT";

  import updInfo from "@/message/CTManage/agent-postinfo-manage/agent-postinfo-update";
  export default {    
    props: {
      option: Object
    },
    data() {
      var checkPostID = (rule, value, callback) => {
          const reg = /^[a-zA-Z0-9]+$/;
          if (reg.test(value)) {
            callback();
          } else {
            callback(new Error("岗位编号只可包含数字或字母"))
          }
      };
      var checkPostName = (rule, value, callback) => {
          const reg = /^[a-zA-Z0-9_\u4e00-\u9fa5]+$/;
          if (reg.test(value)) {
            callback();
          } else {
            callback(new Error("岗位名称只可由汉字、字母、数字或下划线组成"));
          }
      };
      return {
        loading: false,
        queryForm: { //表单数据
          POSTID: '',
          POSTNAME: '',
          REMARK1: '',
          REMARK2: '',
          REMARK3: ''
        },
        rules: { //表单校验规则          
          POSTID: [
            {required: true, message: "请输入岗位编号", trigger: "change"},
            {max:10, message:"岗位编号长度不能超过10个字符", trigger: "change"},
            {validator: checkPostID, trigger: "change"}
          ],
          POSTNAME: [
            {required: true, message: "请输入岗位名称", trigger: "blur"},
            {max:60, message:"岗位名称长度不能超过60个字符", trigger: "change"},
            {validator: checkPostName, trigger: "change"}
          ],
          REMARK1:[{max:30, message:"备注长度不能超过30个字符", trigger: "change"}],
          REMARK2:[{max:30, message:"备注长度不能超过30个字符", trigger: "change"}],
          REMARK3:[{max:30, message:"备注长度不能超过30个字符", trigger: "change"}]
        }
      };
    },
    computed: {
      isShow: {
        get: function () {
          return this.option.isShow;
        },
        set: function (newValue) {
          this.option.isShow = newValue;
        }
      },
    },
    methods: {
        init() {
            this.queryForm.POSTID = this.option.POSTID
            this.queryForm.POSTNAME = this.option.POSTNAME;
            this.queryForm.REMARK1 = this.option.REMARK1;
            this.queryForm.REMARK2 = this.option.REMARK2;
            this.queryForm.REMARK3 = this.option.REMARK3;
        },
        reset() {
            if (this.$refs["queryForm"]) {
                this.$refs["queryForm"].resetFields();
            }
        },
        submit() {
            this.$refs["queryForm"].validate(valid => {
              if (valid) {
                this.loading = true;
                let resBody = new updInfo();
                resBody.data.POSTID = this.queryForm.POSTID;
                resBody.data.POSTNAME = this.queryForm.POSTNAME;
                resBody.data.REMARK1 = this.queryForm.REMARK1;
                resBody.data.REMARK2 = this.queryForm.REMARK2;
                resBody.data.REMARK3 = this.queryForm.REMARK3;
                request(resBody)
                    .then(response=>{
                        this.loading = false;
                        if (response.SYS_HEAD.ReturnCode == "000000") {
                            this.$message({
                                type: "success",
                                message: "操作成功！"
                            });
                            this.isShow = false;
                            this.$emit("refreshTable");
                        } else {
                            this.$message({
                                type: "error",
                                message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
                            });
                        }
                    })
                    .catch(error=>{
                        console.log(error);
                        this.$message({
                            type: "warning",
                            message: "页面出错！"
                        });
                        this.loading = false;
                    })
              }
            })
        }

    },
  };

</script>

<style lang="scss" scope>


</style>
